<%@ page language="java" pageEncoding="utf-8" %>
<html>
<head>
    <title>登录</title>

</head>
<body>
<h2>Hello 欢迎 ${name} </h2>
开始测试JS-SDK：
<button id="photo"><h1>拍照（显示一张）</h1></button>
<img src="" id="img1"/>
<img src="" id="img2"/>
<img src="" id="img3"/>
<button id="checkJsApi"><h1>checkJsApi</h1></button>
</body>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript" src="${basePath}/js/jquery-2.1.4.min.js"></script>
<script>
    // 微信信息的以及调用的配置
    wx.config({
        debug: false,
        appId: '${wxConfig.appId}',
        timestamp: '${wxConfig.timestamp}',
        nonceStr: '${wxConfig.nonceStr}',
        signature: '${wxConfig.signature}',
        jsApiList: ['chooseImage', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone']
    });

    wx.ready(function () {
        // wx.checkJsApi({
        //     jsApiList: [
        //         'getNetworkType',
        //         'previewImage',
        //         'chooseImage',
        //         'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone'
        //     ],
        //     success: function (res) {
        //         alert(JSON.stringify(res));
        //     },
        //     error: function () {
        //         alert("shibai")
        //     }
        // });

        // 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口（即将废弃）
        wx.onMenuShareTimeline({
            title: '第八篇 ：微信公众平台开发实战Java版之如何网页授权获取用户基本信息', // 分享标题
            link: "http://bhwt8r.natappfree.cc/5099149.html",
            imgUrl: "http://img.blog.csdn.net/20170720141219500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWVfc2hlbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center", // 分享图标
            success: function (res) {
                // 用户确认分享后执行的回调函数
                alert(JSON.stringify(res));
            },
            cancel: function (res) {
                // 用户取消分享后执行的回调函数
                alert(JSON.stringify(res) + "你取消了分享，谢谢");
            }
        });

        // 获取“分享给朋友”按钮点击状态及自定义分享内容接口（即将废弃）测试无效
        wx.onMenuShareAppMessage({
            title: '第七篇 ：微信公众平台开发实战Java版之如何获取微信用户基本信息', // 分享标题
            desc: "第七篇 ：微信公众平台开发实战Java版之如何获取微信用户基本信息", // 分享描述
            link: "http://www.cnblogs.com/liuhongfeng/p/5057167.html",
            imgUrl: "http://img.blog.csdn.net/20170720141219500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWVfc2hlbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center", // 分享图标
            //type: 'link' // 分享类型,music、video或link，不填默认为link
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });

        //获取“分享到QQ”按钮点击状态及自定义分享内容接口
        wx.onMenuShareQQ({
            title: '第六篇 ：微信公众平台开发实战Java版之如何自定义微信公众号菜单', // 分享标题
            desc: '第六篇 ：微信公众平台开发实战Java版之如何自定义微信公众号菜单', // 分享描述
            link: 'http://www.cnblogs.com/liuhongfeng/p/4857312.html', // 分享链接
            imgUrl: 'http://img.blog.csdn.net/20170720141219500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWVfc2hlbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center', // 分享图标
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                // 用户取消分享后执行的回调函数
            }
        });

        //获取“分享到QQ空间”按钮点击状态及自定义分享内容接口
        wx.onMenuShareQZone({
            title: '分享到QQ空间标题', // 分享标题
            desc: '分享到QQ空间描述', // 分享描述
            link: 'http://www.cnblogs.com/liuhongfeng/p/4857312.html', // 分享链接
            imgUrl: 'http://img.blog.csdn.net/20170720141219500?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWVfc2hlbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center', // 分享图标
            success: function () {
                // 用户确认分享后执行的回调函数
            },
            cancel: function () {
                alert("ha");
                // 用户取消分享后执行的回调函数
            }
        });

        document.querySelector('#photo').onclick = function () {
            wx.chooseImage({
                count: 3, // 默认9
                sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                success: function (res) {
                    var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                    // alert(localIds);
                    $("#img1").attr("src", localIds[0]);
                    $("#img2").attr("src", localIds[1]);
                    document.querySelector("#img3").setAttribute("src", localIds[2]);
                }
            });
        }
    });


</script>
</html>